Što su 3D Transformacije u CSS-u?

3D transformacije omogućuju manipulaciju elemenata na 3D prostoru pomoću CSS-a. Ovdje ćemo prikazati i objasniti nekoliko osnovnih 3D transformacija.

1. Rotacija u 3D prostoru (rotated)

Rotacija u 3D prostoru omogućava rotiranje elemenata oko bilo kojeg osi u 3D prostoru.

CSS: transform: rotated(1, 1, 0, 45deg);

2. Pomicanje u 3D prostoru (translated)

Pomicanje u 3D prostoru omogućava pomicanje elemenata duž X, Y i Z osi.

CSS: transform: translated(50px, 50px, 100px);

3. Skaliranje u 3D prostoru (scaled)

Skaliranje u 3D prostoru omogućava promjenu veličine elementa duž X, Y i Z osi.

CSS: transform: scaled(1.5, 1.5, 1.5);

4. Skretanje u 3D prostoru (perspective)

Perspektiva omogućava efekt dubine i daje 3D izgled objekta kada je promijenjena točka gledanja.

CSS: perspective: 500px;